<template>
  <el-form  ref="ruleFormRef" :model="formInline" :rules="formRules" label-width="auto" label-position="top" v-loading="isLoading">
    <el-row :gutter="30">

			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.id' prop='id'>
					<el-input v-model.trim='formInline.id' clearable :placeholder='prompt?.id' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.unityName' prop='unityName'>
					<el-input v-model.trim='formInline.unityName' clearable :placeholder='prompt?.unityName' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.useInfo' prop='useInfo'>
					<el-input v-model.trim='formInline.useInfo' clearable :placeholder='prompt?.useInfo' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.mealType' prop='mealType'>
					<el-input v-model.trim='formInline.mealType' clearable :placeholder='prompt?.mealType' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.num' prop='num'>
					<el-input v-model.trim='formInline.num' clearable :placeholder='prompt?.num' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.amount' prop='amount'>
					<el-input v-model.trim='formInline.amount' clearable :placeholder='prompt?.amount' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.payType' prop='payType'>
					<el-input v-model.trim='formInline.payType' clearable :placeholder='prompt?.payType' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.createdBy' prop='createdBy'>
					<el-input v-model.trim='formInline.createdBy' clearable :placeholder='prompt?.createdBy' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.createdAt' prop='createdAt'>
					<el-input v-model.trim='formInline.createdAt' clearable :placeholder='prompt?.createdAt' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.personal' prop='personal'>
					<el-input v-model.trim='formInline.personal' clearable :placeholder='prompt?.personal' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.unity' prop='unity'>
					<el-input v-model.trim='formInline.unity' clearable :placeholder='prompt?.unity' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.project' prop='project'>
					<el-input v-model.trim='formInline.project' clearable :placeholder='prompt?.project' />
				</el-form-item>
			</re-col>
			<re-col :value='12' :xs='24' :sm='24'>
				<el-form-item :label='titles?.type' prop='type'>
					<el-input v-model.trim='formInline.type' clearable :placeholder='prompt?.type' />
				</el-form-item>
			</re-col>    </el-row>
  </el-form>
</template>

<script setup lang="ts">
import { ref,reactive } from "vue";
import ReCol from "@/components/ReCol";
import type { FormRules } from "element-plus";
import { titles,prompt } from './index';
import type { infoType } from '@/api/manage/business-records/SMS-sales-records/index';
type FormProps = {
	formInline: infoType,
	isLoading: boolean
}

const props = withDefaults(defineProps<FormProps>(), {
	formInline: () => ({} as infoType),
	isLoading: false
});

const formRules = reactive(<FormRules>{id: [{ required: true, message: prompt?.id, trigger: 'blur' },],
unityName: [{ required: true, message: prompt?.unityName, trigger: 'blur' },],
useInfo: [{ required: true, message: prompt?.useInfo, trigger: 'blur' },],
mealType: [{ required: true, message: prompt?.mealType, trigger: 'blur' },],
num: [{ required: true, message: prompt?.num, trigger: 'blur' },],
amount: [{ required: true, message: prompt?.amount, trigger: 'blur' },],
payType: [{ required: true, message: prompt?.payType, trigger: 'blur' },],
createdBy: [{ required: true, message: prompt?.createdBy, trigger: 'blur' },],
createdAt: [{ required: true, message: prompt?.createdAt, trigger: 'blur' },],
personal: [{ required: true, message: prompt?.personal, trigger: 'blur' },],
unity: [{ required: true, message: prompt?.unity, trigger: 'blur' },],
project: [{ required: true, message: prompt?.project, trigger: 'blur' },],
type: [{ required: true, message: prompt?.type, trigger: 'blur' },],
});
const ruleFormRef = ref();
//    const newFormInline = ref(props.formInline as any);
//
//
//    watch(()=>props.formInline,()=>{
//    	newFormInline.value = props.formInline
//    },{
//    	deep:true,
//    	immediate:true
//    })
function getRef() {
  return ruleFormRef.value;
}

defineExpose({ getRef });
</script>
